<template>
    <el-dialog v-model="visible" title="预览" :width="width+'mm'">
        <template #header="{ close, titleId, titleClass }">
            <div style="display: flex;align-items: center;">
              <h4>预览</h4>
              <el-button type="primary" size="small" style="margin-left: 10px;" @click="toPdf">PDF</el-button>
              <el-button type="primary" size="small" @click="print">打印</el-button>
            </div>
          </template>
          <div v-loading="spinning">
            <div id="preview_content_tasks"></div>
          </div>
    </el-dialog>
</template>
<script setup>
    import {ref,defineEmits} from "vue"
    let emit = defineEmits(['itfo'])
    let visible=ref(false)
    let spinning=ref(true)
    let waitShowPrinter=ref(false)
      // 纸张宽 mm
    let width=ref(0)
      // 模板
    let hiprintTemplate=ref(null)
      // 数据
    let printData=ref({})
    const itfo=(hiprintTemplater, printDatat, widthn = '210') =>{
      visible.value = true
      spinning.value = true
      console.log(printDatat);
      width.value = hiprintTemplater.editingPanel?hiprintTemplater.editingPanel.width:widthn;
      hiprintTemplate.value = hiprintTemplater
      printData.value = printDatat
      setTimeout(() => {
        // eslint-disable-next-line no-undef
        $('#preview_content_tasks').html(hiprintTemplate.value.getHtml(printDatat))
        spinning.value = false
      }, 500)
    }
    const print=() =>{
      waitShowPrinter.value = true
      console.log(hiprintTemplate.value);
      hiprintTemplate.value.print(printData.value, {}, {
        callback: () => {
          waitShowPrinter.value = false
        }
      })
    }
    const toPdf=()=>{
        hiprintTemplate.value.toPdf(printData.value, '打印预览pdf');
    }
    defineExpose({
        itfo
    })
</script>
<style>

</style>